<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" layout:decorate="main"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
<head>
    <title>执行开发计划</title>
    <link th:href="@{/localcss/crmlist.css}" href="../static/localcss/crmadd.css" rel="stylesheet">
</head>
<body>
<div layout:fragment="content">
    <div class="">
        <div class="clearfix"></div>
        <div class="row">
            <div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                    <div class="x_title">
                        <h2>销售机会详情</h2>
                        <div class="clearfix"></div>
                    </div>
                    <div class="x_content">
                        <div id="datatable-responsive_wrapper"
                             class="dataTables_wrapper form-inline dt-bootstrap no-footer">
                            <div class="row">
                                <div class="col-sm-12">
                                    <table id="datatable-responsive"
                                           class="table table-striped table-bordered dt-responsive nowrap dataTable no-footer dtr-inline collapsed"
                                           cellspacing="0" width="100%" role="grid"
                                           aria-describedby="datatable-responsive_info" style="width: 100%;">
                                        <tr role="row">
                                            <th class="sorting_asc" style="width: 200px">编号</th>
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${chance.chcId}"></td>
                                            <th class="sorting_asc" style="width: 200px">客户名称
                                            </th>
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${chance.chcCustName}"></td>
                                        </tr>
                                        <tr role="row" class="odd">
                                            <th class="sorting_asc" style="width: 200px">负责人
                                            </th>
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${chance.chcLinkman}"></td>
                                            <th class="sorting_asc" style="width: 200px">机会来源
                                            </th>
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${chance.chcSource}"></td>
                                        </tr>
                                        <tr role="row">
                                            <th class="sorting_asc" style="width: 200px">成功机率(%)
                                            </th>
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${chance.chcRate}"></td>
                                            <th class="sorting_asc" style="width: 200px">公司电话
                                            </th>
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${chance.chcTel}"></td>
                                        </tr>
                                        <tr role="row">
                                            <th class="sorting_asc" style="width: 200px">概要
                                            </th>
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${chance.chcTitle}"></td>
                                            <th class="sorting_asc" style="width: 200px">机会描述
                                            </th>
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${chance.chcDesc}"></td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="clearfix"></div>
        <div class="row">
            <div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                    <div class="x_title">
                        <h2>客户开发计划</h2>
                        <ul class="nav navbar-right panel_toolbox">
                            <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                            </li>
                        </ul>
                        <div class="clearfix"></div>
                    </div>
                    <div class="x_content" style="display: block;">
                        <div id="datatable-responsive_wrapper"
                             class="dataTables_wrapper form-inline dt-bootstrap no-footer">
                            <div class="row">
                                <div class="col-sm-12">
                                    <table id="datatable-responsive"
                                           class="table table-striped table-bordered dt-responsive nowrap dataTable no-footer dtr-inline collapsed"
                                           cellspacing="0" width="100%" role="grid"
                                           aria-describedby="datatable-responsive_info" style="width: 100%;">
                                        <thead>
                                        <tr role="row">
                                            <th class="sorting_asc" tabindex="0"
                                                aria-controls="datatable-responsive" rowspan="1" colspan="1"
                                                style="width: 70px;"
                                                aria-label="First name: activate to sort column descending"
                                                aria-sort="ascending">日期
                                            </th>
                                            <th class="sorting" tabindex="0"
                                                aria-controls="datatable-responsive" rowspan="1" colspan="1"
                                                style="width: 10px;"
                                                aria-label="Last name: activate to sort column ascending">
                                                计划项
                                            </th>
                                            <th class="sorting" tabindex="0"
                                                aria-controls="datatable-responsive" rowspan="1" colspan="1"
                                                style="width: 90px;"
                                                aria-label="Last name: activate to sort column ascending">
                                                执行效果
                                            </th>
                                            <th class="sorting" tabindex="0"
                                                aria-controls="datatable-responsive" rowspan="1" colspan="1"
                                                style="width: 70px;"
                                                aria-label="Last name: activate to sort column ascending">
                                                操作
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr role="row" class="odd" th:each="plan:${planList}">
                                            <td tabindex="0" class="sorting_1"
                                                th:text="${#dates.format(plan.plaDate, 'yyyy-MM-dd')}"></td>
                                            <td th:text="${plan.plaTodo}"></td>
                                            <td>
                                                <input th:if="${plan.plaResult=='' or plan.plaResult==null}"
                                                    name="plaResult" class="form-control col-md-7 col-xs-12" style="width: 100%"
                                                    data-validate-words="1" required="required"
                                                    placeholder="请输入计划项结果" type="text" value="满意"
                                                    th:value="${plan.plaResult}">
                                                <span th:if="${plan.plaResult!='' and plan.plaResult!=null}"
                                                      th:text="${plan.plaResult}"></span>
                                            </td>
                                            <td>
                                                <button th:if="${plan.plaResult=='' or plan.plaResult==null}"
                                                        type="button" class="btn btn-primary" value="保存"
                                                        th:onclick="|savePlanResult(this,${plan.plaId})|">保存
                                                </button>
                                            </td>
                                        </tr>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-md-6 col-md-offset-3">
                            <button id="send" type="button" th:onclick="|failPlan(${chance.chcId})|" class="btn btn-danger">终止开发计划</button>
                            <button type="button" class="btn btn-primary" id="back">返回</button>
                            <button  type="button" th:onclick="|addPlan(${chance.chcId})|" class="btn btn-dark">制定开发计划</button>
                            <button  type="button" class="btn btn-success" th:onclick="|successPlan(${chance.chcId})|">开发成功</button>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    <br/><br/>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script layout:fragment="js">
    $(document).ready(function(){
        $("#back").on("click",function(){
            window.history.back();
        });
    });

    //记录执行结果
    function savePlanResult(ele,id) {
        var plaResult = $(ele).parent().prev().find("input[name=plaResult]").val();
        if(plaResult==""){
            alert("请输入执行效果")
            return;
        }

        $.post("/plan/savePlanResult",
            {plaId:id,plaResult:plaResult},
            function (data) {
                if(data.delResult==true){
                    location.reload();
                }else{
                    alert("添加失败")
                }
            },"json");
    }

    //制定开发计划
    function addPlan(id) {
        location.href="/plan/add?id="+id;
    }

    //开发成功
    function successPlan(id) {
        if(confirm("你确定执行开发成功操作吗？")) {
            $.post("/plan/success", {id: id}, function (data) {
                if (data.delResult == true) {
                    alert("开发成功，已归档");
                    location.href = "/plan/list";
                } else {
                    alert("执行操作失败，请联系管理员！")
                }
            })
        }
    }
    //开发失败
    function failPlan(id) {
        if(confirm("你确定要终止开发吗？")){
            $.post("/plan/fail",{id:id},function (data) {
                if(data.delResult==true){
                    alert("开发失败，已归档");
                    location.href="/plan/list";
                }else{
                    alert("执行操作失败，请联系管理员！")
                }
            })
        }

    }
</script>
</html>